<template>
	<div class="safety_loop_detail">
		<div class="safety_loop">
			<span class="safety_loop_li">
				<img :src="shareImg">
				<div class="img_wrap">
					<span class="head" v-if="SafeToGoDetailTopData.empImg">
						<img :src="SafeToGoDetailTopData.empImg">
					</span>
					<span class="head" v-else="SafeToGoDetailTopData.empImg">
						<img src="../../assets/img/head_img.jpg">
					</span>
					<span class="iflike" :class="[SafeToGoDetailTopData.ifLike? 'ion_heart_red' : 'ion_heart_default']" @click="thumbsUp"></span>
					<h3>{{SafeToGoDetailTopData.shareTitle}}</h3>
				</div>
				<p class="author">by {{SafeToGoDetailTopData.empName}}</p>
				<footer class="foot clearFix">
					<span class="time"><i class="ion ion-android-time"></i>{{SafeToGoDetailTopData.shareTime}}</span>
					<span class="like"><i class="ion ion-ios-heart-outline"></i> {{SafeToGoDetailTopData.likeCount}}</span>
					<span class="classify"><i class="icon_mark"></i>{{SafeToGoDetailTopData.dataTypeText}}</span>
				</footer>
			</span>
		</div>

		<div class="article_con">
			<!-- <article class="con">
				<h4><i class="icon_disk blue_disk ion ion-ios-information-empty"></i>基本信息</h4>
				<p>汇报人: {{SafeToGoContentData.empName}}</p>
				<p>部门: {{SafeToGoContentData.depName}}</p>
				<p>事发标题: {{SafeToGoContentData.s2oType}}</p>
			</article> -->
			<article class="con">
				<h4><i class="icon_disk green_disk ion ion-navicon"></i>事发经过描述</h4>
				<p v-html="SafeToGoContentData.modifyDescribe || '暂无'"></p>
			</article>
			<article class="con">
				<h4><i class="icon_disk blue_disk ion ion-ios-cog-outline"></i>当时采取的措施</h4>
				<p v-html="SafeToGoContentData.modifyStep || '暂无'"></p>
			</article>
			<article class="con">
				<h4><i class="icon_disk yellow_disk ion ion-android-star-outline"></i>值得分享的经验与教训</h4>
				<p v-html="SafeToGoContentData.modifyShare || '暂无'"></p>
			</article>
			<article class="con">
				<h4><i class="icon_disk lightgreen_disk icon_image"></i>相关照片</h4>
				<p><img v-for = "img of s2gImgs" :src="img"/></p>
			</article>

		</div>

	</div>
</template>
<script type="text/javascript">
	import getInterface from '../../assets/js/insterface'
	import PreviewImg from '../../assets/js/previewImg'

	export default{
		data(){
			return{
				SafeToGoDetailUrl:getInterface.getSafeToGoDetailUrl,
				SafeToGoDetailTopData:'',
				SafeToGoContentData:'',
				s2gImgs:[],
				shareImg:''

			}
		},
		mixins:[PreviewImg],
		mounted(){
			this.$el.parentElement.parentNode.style.background = '#fafafa';
			document.title="SafeToGo";
			this.getS2GDetailData();
			let vue = this;
			setTimeout(()=>{
				vue.readImgInfo();
			},1100)
		},
		methods:{
			getS2GDetailData(){
				// let params ={
				// 	id:this.$route.query.id,
				// 	empNo:this.$route.query.empNo
				// }

				this.$http.get(this.SafeToGoDetailUrl+this.$route.query.id + "/" + this.$route.query.empNo,{emulateJSON: true})
				.then((response) => {
					console.log(response)
					let resData = response.data;
					this.SafeToGoDetailTopData = resData.topData;
					this.SafeToGoContentData = resData.contentData;

					this.shareImg = resData.topData.shareImg.split(',')[0];


					this.SafeToGoContentData.modifyDescribe = this.SafeToGoContentData.modifyDescribe.replace(/\r\n/g,'<br/>');
					this.SafeToGoContentData.modifyStep = this.SafeToGoContentData.modifyStep.replace(/\r\n|\n/g,'<br/>');
					this.SafeToGoContentData.modifyShare = this.SafeToGoContentData.modifyShare.replace(/\r\n|\n/g,'<br/>');


					this.SafeToGoDetailTopData.shareTime = resData.topData.shareTime.substring(0,10);
					
					let shareImg = resData.topData.shareImg;
					if(shareImg.indexOf(',') != -1){
						resData.topData.shareImg = shareImg.substring(0,shareImg.indexOf(','));
					}

					this.SafeToGoDetailTopData.ifLike = parseInt(resData.topData.ifLike);
					this.s2gImgs = resData.contentData.s2gImg.split(',');
					/*if(response.data.topData.empImg == ''){
							this.SafeToGoDetailTopData.empImg = '/static/img/head.jpg'
						}*/
					switch(resData.topData.dataType){
						case 0:
							this.SafeToGoDetailTopData.dataTypeText = 'NM'
							break;
						case 1:
							this.SafeToGoDetailTopData.dataTypeText = 'safe to go'
							break;
						case 2:
							this.SafeToGoDetailTopData.dataTypeText = 'safety meeting'
							break;
						case 3:
							this.SafeToGoDetailTopData.dataTypeText = 'SOC'
							break;
					}
				})
			},
			thumbsUp(){
				if(this.SafeToGoDetailTopData.ifLike=="0"){
			    	let params = {id:this.SafeToGoDetailTopData.relationId,empNo:this.$route.query.empNo}

			    	this.$http.post(getInterface.isPraiseUrl,params,{emulateJSON: true})
			    	.then((response) => {
			    		console.log(response)			    		
		    			if(response.data.type == "2"){
		    				console.log("点赞成功！")
					      	this.SafeToGoDetailTopData.ifLike = 1;
					      	if(this.SafeToGoDetailTopData.likeCount == undefined || this.SafeToGoDetailTopData.likeCount == null){
					      		this.SafeToGoDetailTopData.likeCount = 0;
					      	}
					      	this.SafeToGoDetailTopData.likeCount++;
					    }else{
					      	console.log("点赞失败！")
					    }					   
			    	})
			    	.catch(function(response){
			    		console.log(response)
			    	})
		    	}else{
			    	console.log("您已点过赞！")
			    }
		    }
		}
	}
</script>